<%-- 
    Document   : setting
    Created on : 2014-3-18, 9:14:02
    Author     : lcfgly
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@page trimDirectiveWhitespaces="true" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@page import="com.lcfgly.util.ConfigDate" %>
<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">

        <title>店铺设置</title>

        <meta name="description" content="店铺设置">
        <meta name="author" content="pixelcave">
        <meta name="robots" content="noindex, nofollow">
        <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1.0">
        <%@include file="/WEB-INF/jspf/css.jspf" %>
        <link rel="stylesheet" href="<c:url value="/css/select2.css" />" />
        <link rel="stylesheet" href="<c:url value="/css/imgareaselect/imgareaselect-default.css" />" />
        <style>
            .preview {
                background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8);
                border: 1px solid #ACACAC;
                display: inline-block;
                padding: 6px;
                position: relative;
                vertical-align: top;
            }
            .details {
                background: none repeat scroll 0 0 #EBEBEB;
                height: 100px;
                padding: 5px;
                position: relative;
            }
            .progress {
                background: none repeat scroll 0 0 #D7D7D7;
                height: 6px;
                position: relative;
                top: -5px;
            }
            .error-mark {
                display: none;
                font-size: 30px;
                height: 40px;
                position: absolute;
                right: -10px;
                text-align: center;
                top: -10px;
                width: 40px;
                cursor: pointer;
            }
            .details img {
                left: 0;
                position: absolute;
                top: 0;
                height:100px;
            }
            .error-mark {
                color: #EE162D;
            }
            .span2{
                margin-right: 10px;
            }
            .control-group{
                z-index: 2;
                position: relative;
            }
        </style>
    </head>
    <body>
        <div id="page-container" class="full-width">
            <header class="navbar navbar-inverse">
                <%@include file="/WEB-INF/jspf/header.jspf" %>
            </header>
            <jsp:include page="/control/left.html" flush="true" />
            <div id="pre-page-content" style="min-height: 20px">
                <h1><i class="glyphicon-nameplate_alt themed-color" style="line-height: 40px"></i> 店铺设置</h1>
            </div>
            <div id="page-content">
                <ul class="breadcrumb" data-spy="affix" data-offset-top="250">
                    <li>
                        <a href="<c:url value="/control/index.html" />"><i class="glyphicon-display"></i></a> <span class="divider"><i class="icon-angle-right"></i></span>
                    </li>
                    <li class="active"><a href="#">店铺设置</a></li>
                </ul>
                <div class="block block-themed block-last">
                    <div class="block-title">
                        <h4>店铺设置</h4>
                    </div>
                    <div class="block-content">
                        <form method="post" id="shopinferform" class="form-horizontal" >
                            <h4 class="sub-header">基本信息</h4>
                            <span class="help-block" style="color: red;">${error.error}</span>
                            <div class="control-group">
                                <label class="control-label" for="general-text">店铺名称</label>
                                <div class="controls">
                                    <input type="text"  name="uname" value="${user.users.uname}" >
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="general-placeholder">地址</label>
                                <div class="controls">
                                    <c:if test="${!empty user.userinfer.cityaddress}">
                                        <a href="#" id="cgcityid">[修改]</a> ${user.userinfer.cityaddress}
                                    </c:if>
                                    <c:if test="${empty user.userinfer.cityaddress}">
                                        <a href="#" id="cgcityid">[添加]</a>
                                    </c:if>
                                </div>
                            </div>
                            <div class="control-group hidden" id="showcgcityid">
                                <div class="controls">
                                    <select id="pricd" class="span2" name="prcid">
                                    </select><select id="ipcode"  class="hidden span2" name="ipcode" >
                                    </select><select id="cityid" class="hidden span2" name="cityid" >
                                    </select>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="general-placeholder">详细地址</label>
                                <div class="controls">
                                    <input type="text"  name="address" placeholder="详细地址" value="${user.userinfer.address}" >
<!--                                    <span>
                                        <a href="#"  id="latlng" data-toggle="popover" style="color:#F0AD4E;cursor:pointer" >
                                            <i class="glyphicon-warning_sign"></i>
                                            <span style="position: relative;top: 2px">精确定位</span>
                                        </a>
                                    </span>-->
                                    <input type="hidden" value="${user.userinfer.lat}" id="lat" name="lat" />
                                    <input type="hidden" value="${user.userinfer.lng}" id="lng" name="lng" />
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="general-placeholder">QQ</label>
                                <div class="controls">
                                    <input type="text"  name="qq" placeholder="QQ" value="${user.userinfer.qq}" >
                                    <span>
                                        <i class="glyphicon-warning_sign"></i>
                                        <span style="position: relative;top: 2px">用于在线交谈</span>
                                    </span>
                                </div>
                            </div>
                             <div style="float: right; position: absolute; top: 350px; right: 50px;">
                                        <img id="mapview"  src="http://api.map.baidu.com/staticimage?center=${user.userinfer.lng},${user.userinfer.lat}&markers=${user.userinfer.lng},${user.userinfer.lat}&zoom=18"  />
                             </div>
                             <div class="control-group">
                                <label class="control-label" for="general-placeholder">手机</label>
                                <div class="controls">
                                    <input type="text" id="phone" name="phone" placeholder="手机" value="${user.userinfer.phone}" >
                                    <span class="help-block" style="color: red;">${error.phone}</span>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="general-placeholder">固定电话</label>
                                <div class="controls">
                                    <input type="text" id="fax" name="tel" placeholder="固定电话" value="${user.userinfer.tel}" >
                                    <span class="help-block" style="color: red;">${error.tel}</span>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label" for="general-placeholder">电子邮箱</label>
                                <div class="controls">
                                    <input type="text" id="email" name="email" placeholder="电子邮箱.." value="${user.userinfer.email}" >
                                    <span class="help-block" style="color: red;">${error.email}</span>
                                </div>
                            </div>
                            <input type="hidden" name="litpic1" id="litpic1" value="${user.imgs[0].imgurl}" />
                            <input type="hidden" name="litpic2" id="litpic2"  value="${user.imgs[1].imgurl}" />
                            <input type="hidden" name="litpic3" id="litpic3" value="${user.imgs[2].imgurl}" />
                        </form>
                        <h4 class="sub-header">店铺展示图(分辨率大于1175px*335px)</h4>
                        <div class="row-fluid row-items">
                            <c:forEach varStatus="varStatus" var="item" items="${user.imgs}" >
                                <c:choose>
                                    <c:when test="${!empty item.imgurl}">
                                        <div class="span4 gallery-image text-center" id="drop_area${varStatus.count}" style="height:130px;">								
                                            <div id="upload${varStatus.count}" style="border: 3px dashed #E5E5E5;padding-top:20px; height:90px;display: none">
                                                <span>点击选择图片开始上传</span><br />
                                                <input type="file" id="uploadfile${varStatus.count}" name="imgFile" />
                                            </div>
                                            <div id="uploadshow${varStatus.count}">
                                                <div class="details text-center"><img id="imgshow${varStatus.count}" src="<%=ConfigDate.config("imagesurl")%>${item.imgurl}" /> </div> 
                                                <div class="progress progress-danger"> <div style="width: 100%" class="bar" id="bar${varStatus.count}"></div></div> 
                                                <div class="error-mark" id="error${varStatus.count}" style="display:block"><span>✘</span></div>
                                            </div>
                                        </div>
                                    </c:when>
                                    <c:otherwise>
                                        <div class="span4 gallery-image text-center" id="drop_area${varStatus.count}" style="height:130px;">								
                                            <div id="upload${varStatus.count}" style="border: 3px dashed #E5E5E5;padding-top:20px; height:70px">
                                                <span>点击选择图片开始上传</span><br />
                                                <input type="file" id="uploadfile${varStatus.count}" name="imgFile" />
                                            </div>
                                            <div id="uploadshow${varStatus.count}" style="display:none">
                                                <div class="details text-center"><img id="imgshow${varStatus.count}" src="<c:url value="/img/placeholders/image_720x450_light.png" />" /> </div> 
                                                <div class="progress progress-danger"> <div style="width: 0%" class="bar" id="bar${varStatus.count}"></div></div> 
                                                <div class="error-mark" id="error${varStatus.count}"><span>✘</span></div>
                                            </div>
                                        </div>
                                    </c:otherwise>
                                </c:choose>
                            </c:forEach>
                        </div>
                        <div class="form-actions" style=" background:none;">
                            <button type="submit" id="formsubmit" class="btn btn-success"><i class="icon-ok"></i> 提交</button>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Footer -->
            <%@include file="/WEB-INF/jspf/footer.jspf" %>
            <!-- END Footer -->
        </div>
            <!-- Modal -->
            <div id="imgModal" class="modal hide fade" data-backdrop="static">
                <div class="modal-header">
                    <h3 id="myModalLabel" style="font-size:14px;color:buttonshadow">为保持图片不变形请选取图片显示区域</h3>
                </div>
                <div class="modal-body">
                    <p><img id="photo"  style="max-width:530px;max-height:400px;"></p>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-primary">保存</button>
                </div>
            </div>
        <a href="#" id="to-top"><i class="icon-chevron-up"></i></a>
            <%@include file="/WEB-INF/jspf/js.jspf" %>
        <script src="<c:url value="/js/select2.min.js" />"></script>
        <script src="<c:url value="/js/ajaxfileupload.js" />" ></script>
        <script src="<c:url value="/js/jquery.imgareaselect.pack.js" />"></script>
        <script>
            var cityid=${user.userinfer.cityid};
            var imgpath="<%=ConfigDate.config("imagesurl")%>";
        </script>
        <script src="<c:url value="/js/controller/setting.js" />"></script>
    </body>
</html>
